/**
 * @Author:周邱艳
 * @Date:20200617
 * @Describle:这是策略列表页
 */
import {
    Card,
    Button,
    Table,
    Input,
    Space,
} from 'antd'
import {BrowserRouter as Router,Link} from "react-router-dom";
import React, { Component } from "react";
import axios from "axios"
import Highlighter from 'react-highlight-words';
import { SearchOutlined } from '@ant-design/icons';
import {URL} from '../../../index'

export default class StrategyListTable extends Component{
    state={
        strategyInfoList:[],//所有分类的数组
        loading:false,//是否正在请求加载中
        searchText: '',//搜索内容
        searchedColumn: '',//搜索列表
    }
    //初始化table的所有列信息的数组
    constructor(props) {
        super(props);
        this.getCategorys=this.getCategorys.bind(this)

    }
    //加载列表
    initColumns =() =>{
        this.columns = [
            {
                title: '策略名称',
                dataIndex: 'strategyName',
                ...this.getColumnSearchProps('strategyName'),
            },
            {
                title: '基金数量',
                dataIndex: 'fdShareLength',
                ...this.getColumnSearchProps('fdShareLength'),
            },
            {
                title: '股票数量',
                dataIndex: 'shareLength',
                ...this.getColumnSearchProps('shareLength'),
            },
            {
                title: '股票行业',
                dataIndex: 'shareIndustry',
                ...this.getColumnSearchProps('shareIndustry'),
                render:(shareIndustry)=>{
                    return(
                        <span>
                            <span>{shareIndustry===8?'软件服务':(shareIndustry===9?'电器设备':(shareIndustry===10?'汽车配件':(shareIndustry===11?'元器件':(shareIndustry===12?'专用器械':(shareIndustry==13?'环境保护':'无')))))}</span>
                        </span>
                    )
                }

            },
            {
                title: '股票市场',
                dataIndex: 'shareMarket',
                ...this.getColumnSearchProps('shareMarket'),
                render:(shareMarket)=>{
                    return(
                        <span>
                            <span>{shareMarket===14?'创业板':(shareMarket===15?'主板':(shareMarket==16?'中小板':"无"))}</span>
                        </span>
                    )
                }
            },
            {
                title: '股票业绩报告',
                dataIndex: 'sharePerformation',
                ...this.getColumnSearchProps('sharePerformation'),
                render:(sharePerformation)=>{
                    return(
                        <span>
                            <span>{sharePerformation===17?'预减':(sharePerformation===18?'首亏':(sharePerformation===19?'略增':(sharePerformation===20?'预增':(sharePerformation==21?'略减':"无"))))}</span>
                        </span>
                    )
                }
            },
            {
                title: '基金类型',
                dataIndex: 'fdShareType',
                ...this.getColumnSearchProps('fdShareType'),
                render:(fdShareType)=>{
                    return(
                        <span>
                            <span>{fdShareType===1?'股票型':(fdShareType===2?'混合型':(fdShareType==3?'债券型':"无"))}</span>
                        </span>
                    )
                }
            },
            {
                title: '基金投资类型',
                dataIndex: 'fdShareInvestType',
                ...this.getColumnSearchProps('fdShareInvestType'),
                render:(fdShareInvestType)=>{
                    return(
                        <span>
                            <span>{fdShareInvestType===4?'货币市场型':(fdShareInvestType===6?'灵活配置型':(fdShareInvestType===5?'被动指数型':(fdShareInvestType==7?'货币型':"无")))}</span>
                        </span>
                    )
                }
            },
            {
                title: '基金规模下限',
                dataIndex: 'fdShareScaleMin',
                ...this.getColumnSearchProps('fdShareScaleMin'),
            },
            {
                title: '基金规模上限',
                dataIndex: 'fdShareScaleMax',
                ...this.getColumnSearchProps('fdShareScaleMax'),
            },
            {
                title: '操作',
                render:(record) =>
                    <Button type="primary">
                        <Router>
                            <Link to={"/creatPort"}  onClick={()=>{this.props.addPort(record.strategyId)}}>
                                创建组合
                            </Link>
                        </Router>
                    </Button>
            },
        ];
    }
    //异步获取分类列表显示
    getCategorys() {
        //数据请求
        axios({
            method: "GET",
            url: URL + "/strategy/allStrategyInfo",
            params: {}
        }).then(
            (res) => {
                //状态码判断
                if(res.data.code===200){
                    //数据更新
                    this.setState({
                        strategyInfoList: this.state.strategyInfoList.concat(res.data.strategyInfoList)
                    })
                    //状态码判断
                }else if(res.data.code === 500){
                    this.props.history.push('/serverError')
                }
                //错误处理
            }).catch(function (error) {
            console.log(error);
        })
    }
    //组件挂载前
    componentWillMount() {
        this.initColumns()
    }
    //组件挂载后
    componentDidMount() {
        this.getCategorys()
    }
    //搜索函数
    getColumnSearchProps = dataIndex => ({
        filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }) => (
            <div style={{ padding: 8 }}>
                <Input
                    ref={node => {
                        this.searchInput = node;
                    }}
                    placeholder={`Search ${dataIndex}`}
                    value={selectedKeys[0]}
                    onChange={e => setSelectedKeys(e.target.value ? [e.target.value] : [])}
                    onPressEnter={() => this.handleSearch(selectedKeys, confirm, dataIndex)}
                    style={{ width: 188, marginBottom: 8, display: 'block' }}
                />
                <Space>
                    {/*搜索按键*/}
                    <Button
                        type="primary"
                        onClick={() => this.handleSearch(selectedKeys, confirm, dataIndex)}
                        icon={<SearchOutlined />}
                        size="small"
                        style={{ width: 90 }}
                    >
                        Search
                    </Button>
                    {/*重置按键*/}
                    <Button onClick={() => this.handleReset(clearFilters)} size="small" style={{ width: 90 }}>
                        Reset
                    </Button>
                </Space>
            </div>
        ),
        filterIcon: filtered => <SearchOutlined style={{ color: filtered ? '#1890ff' : undefined }} />,
        onFilter: (value, record) =>
            record[dataIndex].toString().toLowerCase().includes(value.toLowerCase()),
        onFilterDropdownVisibleChange: visible => {
            if (visible) {
                setTimeout(() => this.searchInput.select());
            }
        },
        render: text =>
            this.state.searchedColumn === dataIndex ? (
                <Highlighter
                    highlightStyle={{ backgroundColor: '#ffc069', padding: 0 }}
                    searchWords={[this.state.searchText]}
                    autoEscape
                    textToHighlight={text.toString()}
                />
            ) : (
                text
            ),
    });
    //搜索函数
    handleSearch = (selectedKeys, confirm, dataIndex) => {
        confirm();
        this.setState({
            searchText: selectedKeys[0],
            searchedColumn: dataIndex,
        });
    };
    //重置函数
    handleReset = clearFilters => {
        clearFilters();
        this.setState({ searchText: '' });
    };
    //数据渲染
    render() {
        //取出状态数据
        const {loading}=this.state
        return (
            <div>
                <Card >
                    <Table
                        rowKey="strategyId"
                        loading={loading}
                        columns={this.columns}
                        dataSource={this.state.strategyInfoList}
                        bordered={true}
                        pagination={{defaultPageSize:4,showQuickJumper:true}}
                    />

                </Card>
            </div>
        )
    }
}
